<template>
  <div class="recharge-records">
    <x-header>充值记录<a slot="right"></a></x-header>
    <scroller :noDataText="noDataText" :on-refresh="refresh" :on-infinite="infinite" style="padding-top:46px;min-height: 500px;" ref="my_scroller">
      <div>
        <group v-if="$route.params.id===0">
          <cell v-for="(item,i) in list" :key="i" :title="item.msg" :value="getTime(item.createTime)" is-link  @click.native="_toDetail(item)"></cell>
        </group>
        <group v-else>
          <cell v-for="(item,i) in list" :key="i" :title="item.msg" :value="getTime(item.createTime)" is-link  @click.native="_toDetail(item)"></cell>
        </group>
      </div>
    </scroller>
  </div>
</template>
<script>
import { Vue, Component } from 'vue-property-decorator';
import { namespace } from 'vuex-class';
import { getUnixTime } from '../../js/utils'
import {
  XHeader,
  Group,
  Cell
} from 'vux';
const MineStore = namespace('mine');

@Component({
  components: {
    XHeader,
    Group,
    Cell
  }
})
export default class RechargeRecords extends Vue {
  @MineStore.Action getTransfers;
  @MineStore.State walletDetail;
  currentPage = 1
  pageSize = 10
  list = []
  noDataText = '--我也是有底线的--'
  myTime = new Date()
  getTime (t) {
    return getUnixTime(t * 1000)
  }
  infinite () {
    this.init()
    this.currentPage++
    setTimeout(() => {
      this.$refs.my_scroller.finishInfinite(true)
    }, 1000)
  }
  refresh () {
    this.myTime = new Date()
    setTimeout(() => {
      this.list = []
      this.currentPage = 1
      this.$refs.my_scroller.finishPullToRefresh()
    }, 1000)
  }
  _toDetail (item) {
    this.$router.push({
      path: '/walletdetail',
      query: {
        item
      }
    })
  }
  created () {}
  init () {
    const params = {
      current: this.currentPage,
      pageSize: this.pageSize,
      type: this.$route.params,
      createTime: getUnixTime(this.myTime)
    }
    this.getTransfers(params).then(msg => {
      if (msg) {
        this.$vux.toast.text(msg, 'middle');
      } else {
        const { list } = this.walletDetail
        this.list = this.list.concat(list)
      }
    })
  }
}
</script>
